<div class="ngs-root">
  <div class="ngs-layout-header">
    <div class="ngs-layout-header-left">
      <a class="ngs-layout-logo">
        <img src="../../../assets/logo.png" alt="logo">
      </a>
      <span class="system-name">悦客烧烤-运营端</span>
    </div>
    <div class="ngs-layout-header-right">
      <nz-avatar [nzSrc]="userModel.avatarUrl"></nz-avatar>
      <a nz-dropdown [nzDropdownMenu]="menu" class="system-user">
        {{ userModel.name }}
        <i nz-icon nzType="down"></i>
      </a>
      <nz-dropdown-menu #menu="nzDropdownMenu">
        <ul nz-menu nzSelectable>
          <li nz-menu-item>修改个人信息</li>
          <li nz-menu-item>修改密码</li>
          <li nz-menu-item (click)="logout()">退出</li>
        </ul>
      </nz-dropdown-menu>
    </div>
  </div>

  <div class="ngs-layout-body">
    <div class="ngs-layout-body-left">
      <ul nz-menu nzTheme="light" nzMode="inline">
        <li nz-menu-item>
          <a [routerLink]="['']">
            <i nz-icon nzType="home" theme="outline"></i>
            <span class="nav-text">首页</span>
          </a>
        </li>
        <li nz-submenu *ngFor="let perm of userModel.rbacPermList let i=index">
          <span title>
            <i nz-icon [nzType]="perm.icon" nzTheme="outline"></i>
            <span class="nav-text">{{perm.name}}</span>
          </span>
          <ul *ngIf="perm.children">
            <li nz-menu-item *ngFor="let permItem of perm.children">
              <a [routerLink]="[permItem.code]">{{ permItem.name}} </a>
            </li>
          </ul>
        </li>
      </ul>
    </div>
    <div class="ngs-layout-body-right">
      <div class="ngs-root-body">
        <nz-content>
          <div class="inner-content">
            <router-outlet></router-outlet>
          </div>
        </nz-content>
      </div>
  
    </div>
  </div>

</div>